<template>
  <div>
    <el-input :max="max" :min="min" :type="type" :maxlength="maxlength" :size="size" :placeholder="placeholder" v-model="num" @blur="blur" v-bind="$attrs"></el-input>
  </div>
</template>

<script>

export default {
  inheritAttrs: false,
  name: "MlInput",
  components: {},
  props: {
    type: {
      type: String,
      default: "text"
    },
    max: {
      type: [String, Number],
      default: "100"
    },
    min: {
      type: [String, Number],
      default: "1"
    },
    maxlength: {
      type: [String, Number],
      default: "100"
    },
    nums: {
      type: [String, Number],
      default: ""
    },
    placeholder: {
      type: [String, Number],
      default: "请输入"
    },
    is_empty: {
      type: Boolean,
      default: true
    },
    size: {
      type: String,
      default: "mini"
    }
  },
  data() {
    return {
      num: 0
    }
  },
  mounted() {
    this.num = this.nums
  },
  watch: {
    nums() {
      this.num = this.nums
    }
  },
  methods: {
    blur() {
      if (this.type == "number") {
        if (this.num == "") {
          this.num = this.nums
        }
        if (Number(this.num) > Number(this.max)) {
          this.num = this.max
        }
        if (Number(this.num) < Number(this.min)) {
          this.num = this.min
        }
      } else if (!this.is_empty) {
        if (this.num == "") {
          this.num = this.nums
          if (this.nums == "") {
            this.num = "标题"
          }
        }
      }
      this.$emit("blur", this.num)
    }
  }
};
</script>
